<template>
	<view class="wrap">
		<view class="waterfall_feeds">
			<view class="waterfall_feeds_colum leftColum waterfallFeedsLeftColum1">
				<view class="waterfall_feeds_item" v-if="index%2==0" v-for="(item,index) in newList" :key="item.id" @tap='jump(item)'>
					<cos-wqvue-image :item="item"></cos-wqvue-image>
				</view>
			</view>
			<view class="waterfall_feeds_colum rightColum waterfallFeedsRightColum1">
				<view class="waterfall_feeds_item" v-if="index%2==1" v-for="(item,index) in newList" :key="item.id" @tap='jump(item)'>
					<cos-wqvue-image :item="item"></cos-wqvue-image>
				</view>
			</view>
		</view>
		<u-loadmore marginBottom="20" v-if="loadStatus != 'none'" :status="loadStatus"></u-loadmore>
		
		<!-- 操作弹窗 -->
		<u-action-sheet :list="auditingList" v-model="auditingAction" @click="auditingActionCon"></u-action-sheet>
		<!-- 原因弹窗 -->
		<u-action-sheet :list="reasonList" v-model="reasonAction" @click="reasonActionCon"></u-action-sheet>
	</view>
</template>

<script>
import cosWqvueImage from '../../components/cos-media/cos-wqvue-image.vue';
export default {
	components: {
		cosWqvueImage
	},
	props: {
		list: Array,
		isShowUser:{
			type:Boolean,
			default:true
		},
		loadStatus: {
			type: String,
			default: 'loading'
		},
		admin: {
			type:Boolean,
			default: false
		}
	},
	 computed:{
		newList(){
			return this.list;
		}
	},
	data() {
		return {
			auditingAction: false,
			reasonAction:false,
			indexPostAd: this.$c.indexPostAd,
			auditingList: [{
					text: '通过',
					color: '',
					key: 'pass'
				},
				{
					text: '驳回',
					color: 'red',
					key: 'reject'
				}
			],
			reasonList:[{
					text: '图片带不明水印',
					color: '',
					key:1
				},{
					text: '不能出现任意联系方式',
					color: '',
					key:2
				},{
					text: '暴力，政治等',
					color: '',
					key:3
				},{
					text: '内容低俗',
					color: '',
					key:4
				},{
					text: '图片，文字涉黄',
					color: '',
					key:5
				}
			],
			choosePost: '',
			chooseIndex: ''
		};
	},
	methods: {
		onAuditing(postInfo, index) {
			this.auditingAction = true;
			this.choosePost = postInfo;
			this.chooseIndex = index;
		},
		auditingActionCon(index) {
			let key = this.auditingList[index].key;
			if (key == 'pass') {
				this.pass();
			}
		
			if (key == 'reject') {
				this.reasonAction = true;
			}
		},
		reasonActionCon(index) {
			this.reject(this.reasonList[index].text);
		},
		pass() {
			uni.showLoading({
				mask: true,
				title: '通过中...'
			});
			
			this.$H.post('manager/pass', {id: this.choosePost.id, type:'album'}).then(res => {
				if (res.status === 200) {
					this.list.splice(this.chooseIndex, 1);
				}
				uni.hideLoading();
			});
		},
		reject(reason) {
			uni.showLoading({
				mask: true,
				title: '驳回中...'
			});
			this.$H.post('manager/reject', {id: this.choosePost.id, reason:reason, type:'album'}).then(res => {
				if (res.status === 200) {
					this.list.splice(this.chooseIndex, 1);
				}
				uni.hideLoading();
			});
		},
		jump(item) {
			uni.navigateTo({
				url: '/pages/post/detail?id=' + item.id + '&type=album'
			});
		},
		jumpUser(uuid) {
			uni.navigateTo({
				url: '/pages/user/home?uuid=' + uuid
			});
		},
		previewMedia(item) {
			let medias = [];
			if(item.video) {
				medias.push({
					url:item.video.url,
					type:'video',
					poster:item.video.poster.path
				})
			}
			
			if(item.images) {
				item.images.forEach(item=>{
					medias.push({
						url:item.url,
						type:'image',
					})
				})
			}
			
			uni.previewMedia({
				sources: medias, // 需要预览的资源列表
				current: 0 // 当前显示的资源序号
			})
		},
		clear() {
			this.$refs.uWaterfall.clear();
		}
	}
};
</script>
<style lang="scss" scoped>
/**瀑布流CSS*/
.waterfall_feeds {
    overflow: hidden;
}
.waterfall_feeds_colum {
    width: -webkit-calc(50% - 10rpx);
    width: calc(50% - 10rpx);
}
.waterfall_feeds_colum:first-child {
    float: left;
}
.waterfall_feeds_colum:nth-child(2) {
    float: right;
}
.waterfall_feeds_item {
    background-color: #fff;
    border-radius: 8rpx;
    margin-bottom: 20rpx;
    overflow: hidden;
}

.line1, .line2 {
    overflow: hidden;
    text-overflow: ellipsis;
}
.line1 {
    word-break: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.line2 {
    word-break: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
</style>
